<template>
    <el-dialog title="需求实现指派" :visible.sync="dialogFormVisible" width="1080px">
        <el-form ref="formData" :model="formData" class="visualDesign-taskPerson">
            <el-form-item prop="designerList">
                <el-transfer
                    filterable
                    :filter-method="filterMethod"
                    filter-placeholder="请输入名称"
                    v-model="formData.designerList"
                    :data="DesignerList"
                    :titles="['可选设计师', '已选设计师']"
                    :props="{key: 'userId',label: 'chineseName'}"
                >
                    <span
                        slot-scope="{ option }"
                    >{{ option.chineseName }} - {{ option.loginName }}</span>
                </el-transfer>
            </el-form-item>
            <el-form-item prop="checkerList" label-width="20px">
                <el-transfer
                    filterable
                    :filter-method="filterMethod"
                    filter-placeholder="请输入名称"
                    v-model="formData.checkerList"
                    :data="DepartmentUser"
                    :titles="['可选审核人', '已选审核人']"
                    :props="{key: 'userId',label: 'userDisplayName'}"
                >
                    <span
                        slot-scope="{ option }"
                    >{{ option.userName }} - {{ option.loginName }}</span>
                </el-transfer>
            </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
            <el-button
                type="primary"
                @click="submitForm('formData')"
                size="small"
                :disabled="loading"
                :icon="loading?'el-icon-loading':'el-icon-circle-plus-outline'"
            >确定</el-button>
        </div>
    </el-dialog>
</template>
<script>
const ERR_OK = 200;
export default {
  data() {
    return {
      formData: {
        userId: this.$store.getters.userId,
        visionDemandId: "",
        checkerList: [162], //默认视觉设计部副主管 郭建凯 参加审核
        designerList: []
      },
      filterMethod(query, item) {
        if (item.loginName && item.chineseName) {
          return (item.loginName + item.chineseName).indexOf(query) > -1;
        } else {
          return (item.loginName + item.userName).indexOf(query) > -1;
        }
      },
      DesignerList: [],
      DepartmentUser: [],
      rules: {
        checkerList: [
          {
            required: true,
            message: "请选择审核人",
            trigger: "change"
          }
        ],
        designerList: [
          {
            required: true,
            message: "请选择设计师",
            trigger: "change"
          }
        ]
      },
      dialogFormVisible: false,
      loading: false
    };
  },
  created() {
    this.getDepartmentUser();
    this.getDesignerList();
  },
  methods: {
    show(item, bool) {
      this.formData.visionDemandId = item.visionDemandId;
      this.dialogFormVisible = true;
      if (bool) {
        this.getAssignedTaskPersonListById();
      }
      if (this.$refs["formData"]) {
        this.$refs["formData"].resetFields();
      }
    },
    getDesignerList() {
      this.$ajax
        .get(
          this.GLOBAL.oaVisionDemand + "/visionDemandBasicInfo/getDesignerList"
        )
        .then(res => {
          if (res.data.code === ERR_OK) {
            this.DesignerList = res.data.data;
          }
        });
    },
    getDepartmentUser() {
      this.$ajax({
        method: "get",
        url: "/system/user/getDeptUserList"
      }).then(res => {
        if (res.data.code === ERR_OK) {
          this.DepartmentUser = res.data.rows;
        }
      });
    },
    getAssignedTaskPersonListById() {
      this.$ajax
        .get(
          this.GLOBAL.oaVisionDemand +
            "/visionDemandStatus/assignedTaskPersonListById?userId=" +
            this.$store.getters.userId +
            "&visionDemandId=" +
            this.formData.visionDemandId
        )
        .then(res => {
          if (res.data.code === ERR_OK) {
            this.formData.designerList = res.data.data.designerList;
            this.formData.checkerList = res.data.data.checkerList;
          } else {
            this.$message.error(res.data.msg);
          }
        });
    },
    submitForm(formName) {
      if (
        this.formData.checkerList.length !== 0 &&
        this.formData.designerList.length !== 0
      ) {
        this.loading = true;
        this.$ajax({
          method: "post",
          url:
            this.GLOBAL.oaVisionDemand +
            "/visionDemandStatus/assignedTaskPersonById",
          data: this.formData
        }).then(res => {
          this.loading = false;
          if (res.data.code === ERR_OK) {
            this.$message.success("指派成功");
            this.dialogFormVisible = false;
            this.$emit("loadData");
          } else {
            this.$message.error(res.data.msg);
          }
        });
      } else {
        this.$message.warning("请选择设计师和审核人");
      }
    }
  }
};
</script>
<style lang="stylus" scoped>
.el-form-item {
    display: inline-block;
    margin-bottom: 10px;
}
</style>
